<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>文章列表</title>
    <!-- 参考 文章类别管理 -->
    <link rel="stylesheet" href="./libs/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/iconfont.css" />
    <link rel="stylesheet" href="./css/main.css" />
    <link rel="stylesheet" href="./libs/layui/css/layui.css" />
  </head>

  <body>
    <div class="container-fluid">
      <div class="common_title">文章列表</div>
      <div class="container-fluid common_con">
        <div class="row opt_btns">
          <div class="col-xs-6">
            <div class="form-inline">
              <input
                type="text"
                id="aname"
                class="form-control input-sm"
                placeholder="输入文章标题..."
              />
              <select
                id="selCategory"
                name=""
                class="form-control input-sm"
              ></select>
              <select id="selStatus" name="" class="form-control input-sm">
                <option value="">所有状态</option>
                <option value="草稿">草稿</option>
                <option value="已发布">已发布</option>
              </select>
              <input
                id="btnSearch"
                type="button"
                value="筛选"
                class="btn btn-success btn-sm"
              />
              <input
                id="btnReset"
                type="reset"
                value="重置"
                class="btn btn-danger btn-sm"
              />
            </div>
          </div>
          <div class="col-xs-6">
            <a
              href="./article_add.html"
              class="btn btn-success btn-sm pull-right"
              id="release_btn"
              >发表文章</a
            >
          </div>
        </div>
        <table class="table table-striped table-bordered table-hover mp20">
          <thead>
            <tr>
              <th>标题</th>
              <th>作者</th>
              <th>分类</th>
              <th class="text-center">发表时间</th>
              <th class="text-center">状态</th>
              <th class="text-center" width="100">操作</th>
            </tr>
          </thead>
          <tbody></tbody>
        </table>
        <div id="pager"></div>
      </div>
    </div>

    <script src="./libs/jquery/jquery.min.js"></script>
    <!-- 导入bootstrap的js文件 -->
    <script src="./libs/bootstrap/js/bootstrap.min.js"></script>
    <!-- 引入 layui -->
    <script src="./libs/layui/layui.js"></script>

    <!-- 引入 模版引擎 -->
    <script src="./libs/art-template/template-web.js"></script>

    <!-- 公共js文件 -->
    <script src="./js/common.js"></script>

    <!-- 自己js文件 首页正常的业务 -->
    <script src="./js/article_list.js"></script>

    <!-- 模版 -->
    <script type="text/html" id="trTpl">
      {{each list}}
      <tr data-id="{{$value.id}}">
        <td>{{$value.title}}</td>
        <td>{{$value.author}}</td>
        <td>{{$value.category}}</td>
        <td class="text-center">{{$value.date}}</td>
        <td class="text-center">{{$value.state}}</td>
        <td class="text-center">
          <a
            href="article_edit.html?id={{$value.id}}"
            class="btn btn-default btn-xs"
            >编辑</a
          >
          <a href="javascript:void(0);" class="btn btn-danger btn-xs delete"
            >删除</a
          >
        </td>
      </tr>
      {{/each}}
    </script>
  </body>
</html>
